<script setup>

/**
 * 注意点:
 * reactive函数只能 对象/数组
 * reactive函数包裹的数据不能直接赋值
 */ 

import { reactive } from 'vue'

const person = reactive({
  name:'王宁',
  age:23
})
const changeName = () => {
  person.name = '我儿王宁'
}
const changeAge = () => {
  person.age++
}
</script>

<template>
  <div>
   <div>{{ person }}</div>
   <button @click="changeName">修改姓名</button>
   <button @click="changeAge"> 增加年龄</button>
  </div>
</template>

<style scoped>

</style>
